<!-- Login dialog BEGIN -->
<div id="login_alert" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document" style="width: 400px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">请登录</h4>
            </div>
            <div class="modal-body">
                <form method="POST" action="${base}/login" accept-charset="UTF-8">
                    <div class="form-group">
                        <label class="control-label" for="username">账号</label>
                        <input class="form-control" id="ajax_login_username" name="username" type="text" required>
                    </div>
                    <div class="form-group">
                        <label class="control-label" for="password">密码</label>
                        <input class="form-control" id="ajax_login_password" name="password" type="password" required>
                    </div>
                    <div class="form-group">
                        <button id="ajax_login_submit" class="btn btn-primary btn-block btn-sm" type="button">
                            登录 Use it
                        </button>
                    </div>
                    <div class="form-group">
                        <div id="ajax_login_message" class="text-danger"></div>
                    </div>
                    <@controls name="register">
                        <fieldset class="form-group">
			    			<#if site.hasValue("weibo_client_id")>
	                            <a class="btn btn-default btn-block" href="${base}/oauth/callback/call_weibo">
	                                <i class="fa fa-weibo"></i> 微博帐号登录
	                            </a>
                            </#if>
                            <#if site.hasValue("qq_app_id")>
	                            <a class="btn btn-default btn-block" href="${base}/oauth/callback/call_qq">
	                                <i class="fa fa-qq"></i> QQ帐号登录
	                            </a>
                            </#if>
                            <#if site.hasValue("github_client_id")>
	                            <a class="btn btn-default btn-block" href="${base}/oauth/callback/call_github">
	                                <i class="fa fa-github"></i> Github帐号登录
	                            </a>
                            </#if>
                        </fieldset>
                    </@controls>
                </form>
            </div>
        </div>
    </div>
</div>

<!--[if lt IE 9]>
<div class="alert alert-danger alert-dismissible fade in" role="alert" style="margin-bottom:0">
	<button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
	<strong>您正在使用低版本浏览器，</strong> 在本页面的显示效果可能有差异。
	建议您升级到
	<a href="http://www.google.cn/intl/zh-CN/chrome/" target="_blank">Chrome</a>
	或以下浏览器：
	<a href="www.mozilla.org/en-US/firefox/‎" target="_blank">Firefox</a> /
	<a href="http://www.apple.com.cn/safari/" target="_blank">Safari</a> /
	<a href="http://www.opera.com/" target="_blank">Opera</a> /
	<a href="http://windows.microsoft.com/en-us/internet-explorer/download-ie" target="_blank">Internet Explorer 9+</a>
</div>
<![endif]-->

<style>
	.nav > li > a {
		padding: 0px 11px;
	}
</style>

<!-- Fixed navbar -->
<header class="site-header headroom">
    <div class="container">
        <nav class="navbar" role="navigation">
            <div class="navbar-header">
                <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="${base}/">
                    <img src="<@resource src=options['site_logo']/>"/>
                </a>
            </div>
            <div class="collapse navbar-collapse">
                <ul class="nav navbar-nav">
					<#if profile??>
						<li data="user">
							<a href="${base}/users/${profile.id}" nav="user"><i class="fas fa-home fa-fw" style="margin-right: 3px"></i>我的主页</a>
						</li>
					</#if>
					<#list channels as row>
						<li class="dropdown plist">
							<a <#if row.list??>class="dropdown-toggle" data-hover="dropdown"</#if><#if row.blank?default("")?trim?length gt 1> href="${row.blank}"<#else> href="${base}/channel/${row.id}"</#if><#if row.target?default("")?trim?length gt 1> target="&{row.target}"</#if> nav="${row.name}">
								<i class="${row.logo}" style="margin-right: 3px"></i>${row.name}
								<#if row.list??><i style="margin-left:3px" class="fas fa-angle-down fa-xs"></i></#if>
							</a>
							<#if row.list??>
								<ul class="dropdown-menu">
		                            <#list row.list as c>
			                            <li>
			                                <a <#if c.blank?default("")?trim?length gt 1> href="${c.blank}"<#else> href="${base}/channel/${c.id}"</#if> target="${c.target}" cnav="${c.name}">
			                                	<i class="${c.logo}" style="margin-right: 3px"></i>${c.name}
			                                </a>
			                            </li>
		                            </#list>
                        		</ul>
							</#if>
						</li>
					</#list>
                </ul>
                <ul class="navbar-button list-inline" id="header_user">
                    <li view="search" class="hidden-xs hidden-sm">
                        <form method="GET" action="${base}/search" accept-charset="UTF-8" class="navbar-form navbar-left">
                            <div class="form-group">
                                <input class="form-control search-input mac-style" placeholder="搜索" name="kw" type="text" value="${kw}">
                                <button class="search-btn" type="submit"><i class="fa fa-search"></i></button>
                            </div>
                        </form>
                    </li>

				<#if profile??>
                    <@controls name="post">
	                    <@shiro.hasPermission name="post:update">
	                        <li>
	                            <a href="${base}/post/editing" class="plus"><i class="far fa-edit fa-fw" style="margin-right: 3px"></i> 写文章</a>
	                        </li>
	                    </@shiro.hasPermission>
                    </@controls>
                    <li class="dropdown">
                        <a href="#" class="user dropdown-toggle" data-toggle="dropdown">
                            <img class="img-circle" src="<@resource src=profile.avatar + '?t=' + .now?time />">
                            <span>${profile.name}</span>
                        </a>
                        <ul class="dropdown-menu" role="menu">
                            <li>
                                <a href="${base}/users/${profile.id}">我的主页</a>
                            </li>
                            <li>
                                <a href="${base}/settings/profile">编辑资料</a>
                            </li>
                            <@shiro.hasPermission name="admin">
                                <li><a href="${base}/admin">后台管理</a></li>
                            </@shiro.hasPermission>
                            <li><a href="${base}/logout">退出</a></li>
                        </ul>
                    </li>
				<#else>
                    <li><a href="${base}/login" class="btn btn-default btn-sm signup">登录</a></li>
                    <@controls name="register">
                        <li><a href="${base}/register" class="btn btn-primary btn-sm signup">注册</a></li>
                    </@controls>
				</#if>
                </ul>
            </div>
        </nav>
    </div>
</header>

<script type="text/javascript">
$(function () {
	$('a[nav]').each(function(){  
        $this = $(this);
        if($this[0].href == String(window.location)){
            $this.closest('li').addClass("active");
        }  
    });
    
    $('a[cnav]').each(function(){
        $this = $(this);
        if($this[0].href == String(window.location)){
        	$this.closest('li').addClass("active"); 
            $this.closest('.plist').addClass("active");
        }  
    });
    
    $('.plist').each(function(){  
        $this = $(this);
        $this.hover(function(){
    		$this.find("a > i.fas.fa-angle-down.fa-xs").removeClass('fa-angle-down').addClass('fa-angle-up');
		}, function(){
    		$this.find("a > i.fas.fa-angle-up.fa-xs").removeClass('fa-angle-up').addClass('fa-angle-down');
		});
    });
});
</script>
<!-- Header END -->
